<template>
	<view class="main_box">
		<view class="fix_title">
			电子钱包信息
		</view>
		<view class="emailInfo">
			<view class="left">
				账户户名
			</view>
			<view class="right">
				{{userInfo.idName}}
			</view>
		</view>
		<view class="emailInfo">
			<view class="left">
				电子账号
			</view>
			<view class="right">
				{{userInfo.cardNo}}
			</view>
		</view>
		<view class="emailInfo">
			<view class="left">
				开户银行
			</view>
			<view class="right">
				{{userInfo.bankName}}
			</view>
		</view>
		<view class="emailInfo">
			<view class="left">
				账户余额
			</view>
			<view class="right">
				{{userInfo.balance}}
			</view>
		</view>
		<view class="fix_title">
			<view class="left">
				Ⅰ类户信息
			</view>
			<image v-show="flag" src="/static/images/blank/rgrgtg.png" mode="" @click="handOpen"></image>
			<image v-show="!flag" src="/static/images/blank/rgerf.png" mode="" @click="handOff"></image>
		</view>
		<view class="emailInfo">
			<view class="left">
				Ⅰ类户名
			</view>
			<view class="right">
				{{userInfo.idName}}
			</view>
		</view>
		<view class="emailInfo">
			<view class="left">
				Ⅰ类账号
			</view>
			<view v-show="flag" class="right">
				{{userInfo.cardNoOne | filterEncrypt(7,12)}}
			</view>
			<view v-show="!flag" class="right">
				{{oneCardNo}}
			</view>
		</view>
		<view class="emailInfo">
			<view class="left">
				开户银行
			</view>
			<view class="right">
				{{userInfo.bankNameOne}}
			</view>
		</view>
		<view class="emailInfo">
			<view class="left">
				身份证号
			</view>
			<view v-show="flag" class="right">
				{{userInfo.idCard | filterEncrypt(6,12)}}
			</view>
			<view v-show="!flag" class="right">
				{{idNo}}
			</view>
		</view>
		<view class="emailInfo">
			<view class="left">
				预留号码
			</view>
			<view v-show="flag" class="right">
				{{userInfo.phoneOne | filterEncrypt(3,7)}}
			</view>
			<view v-show="!flag" class="right">
				{{phone}}
			</view>
		</view>
		<view class="kdn">
			<image src="/static/images/blank/4341yu.png" mode=""></image>
			<view class="subx">
				交通银行 提供产品服务
			</view>
		</view>
		<uni-popup ref="popup" background-color="#fff">
			<view class="popup-content">
				<image src="/static/images/blank/lohf.png" mode="" @click="cancel()"></image>
				<view class="navTop">
					请输入登陆密码
				</view>
				<view class="content">
					查询完整信息
				</view>
				<input type="text" focus="true" v-model="value" password placeholder="请输入小交登陆密码">
				<view class="btn" @click="queRen">
					确认
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import {
		getPhoneCode,
		getTwoUserList,
		getMoneny,
		bindTwoEmpStu,
		getBlankName,
		seeOneCardInfo
	} from '../../common/api/blank.js';
	import {
		queryOrg,
		findBaseArea,
		queryMilkCardBalance,
		queryStudentCardBalance,
		selectCardInfoByIdCardNo,
		openStudentMike
	} from '../../common/api/index.js'
	import {
		_showLoading,
		_showToast
	} from '../../common/js/util.js'
	export default {
		data() {
			return {
				value: '',
				flag: true,
				batId: "",
				orgId: "",
				oneCardNo: "",
				idNo: "",
				phone: "",
				userInfo: {
					idName: "",
					cardNo: "",
					bankName: "",
					balance: "",
					cardNoOne: "",
					bankNameOne: "",
					idCard: "",
					phoneOne: ""
				}
			}
		},
		onBackPress(options) {
			if (options.from === 'navigateBack') {
				return false
			}
			this.back();
			return true
		},
		async onLoad(option) {
			uni.showLoading({
				title: "信息加载中"
			})
			this.batId = option.batId
			this.orgId = option.orgId
			const res = await getMoneny({
				batId: option.batId,
				orgId: option.orgId
			})
			// console.log(res)
			if (res.code == 0) {
				uni.hideLoading()
				Object.keys(this.userInfo).forEach(item => {
					this.userInfo[item] = res.data[item]
				})
				this.oneCardNo = this.userInfo.cardNoOne
				this.idNo = this.userInfo.idCard
				this.phone = this.userInfo.phoneOne
			} else {
				uni.hideLoading()
				_showToast(res.msg)
			}
		},
		components: {

		},
		methods: {
			cancel() {
				this.$refs.popup.close()
			},
			async queRen() {
				if (this.value) {
					const res = await seeOneCardInfo({
						userId: uni.getStorageSync("s_userId"),
						password: this.value,
						batId: this.batId,
						orgId: this.orgId
					})
					if (res.code == 0) {
						console.log(res)
						this.oneCardNo = res.data.cardNoOne
						this.idNo = res.data.idCard
						this.phone = res.data.phoneOne
						this.$refs.popup.close()
						this.flag = false
					} else {
						_showToast(res.msg)
						this.$refs.popup.close()
					}
				} else {
					_showToast("请输入密码")
				}

			},
			handOff() {
				this.flag = true
			},
			handOpen() {
				this.value = ""
				this.$refs.popup.open("center")
			},
			back() {
				var pages = getCurrentPages();
				uni.navigateBack({
					delta: pages.length - 2
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.popup-content {
		// padding: 15rpx;
		width: 670rpx;
		height: 418rpx;
		background: #FFFFFF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		opacity: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
		position: relative;
		image{
			position: absolute;
			top:42rpx;
			right:44rpx;
			width:23rpx;
			height: 23rpx;
		}
		.navTop {
			width: 100%;
			height: 106rpx;
			line-height: 106rpx;
			text-align: center;
			background: #F7F7F7;
			border-radius: 8rpx 8rpx 0rpx 0rpx;
			opacity: 1;
		}

		.content {
			flex: 1;
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 36rpx;
			font-family: Source Han Sans CN-Regular, Source Han Sans CN;
			font-weight: 400;
			color: #020202;
		}

		input {
			width: 620rpx;
			height: 82rpx;
			background: #FFFFFF;
			border-radius: 8rpx 8rpx 8rpx 8rpx;
			opacity: 1;
			border: 1rpx solid #F2F2F2;
			margin-bottom: 22rpx;
		}

		.btn {
			width: 620rpx;
			height: 82rpx;
			line-height: 82rpx;
			text-align: center;
			background: #3478F5;
			border-radius: 8rpx 8rpx 8rpx 8rpx;
			opacity: 1;
			font-size: 28rpx;
			font-family: Source Han Sans CN-Medium, Source Han Sans CN;
			font-weight: 500;
			color: #FFFFFF;
			margin-bottom: 30rpx;
		}
	}

	.main_box {
		padding: 24upx;
		box-sizing: border-box;
		overflow-y: auto;

		.kdn {
			margin: 86rpx 0rpx;
			width: 100%;
			display: flex;
			justify-content: center;
			align-items: center;

			>image {
				width: 34rpx;
				height: 33rpx;
			}

			.subx {
				margin-left: 8rpx;
				height: 34rpx;
				font-size: 23rpx;
				font-family: Source Han Sans CN-Regular, Source Han Sans CN;
				font-weight: 400;
				color: #003A79;
				line-height: 34rpx;
			}
		}

		.emailInfo {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin: 0 45rpx;
			margin-bottom: 46rpx;

			.left {
				height: 46rpx;
				font-size: 32rpx;
				font-family: Source Han Sans CN-Medium, Source Han Sans CN;
				font-weight: 500;
				color: #020202;
				line-height: 46rpx;
			}

			.right {
				height: 44rpx;
				font-size: 30rpx;
				font-family: Source Han Sans CN-Regular, Source Han Sans CN;
				font-weight: 400;
				color: #020202;
				line-height: 44rpx;
			}
		}

		.fix_title {
			margin: 30upx 0 60upx 0;

			display: flex;
			align-items: center;
			margin-left: 10rpx;
			margin-bottom: 56rpx;

			.left {
				font-size: 40upx;
				font-weight: bolder;
			}

			image {
				width: 34rpx;
				height: 34rpx;
				margin-left: 22rpx;
			}

			&::before {
				content: '';
				height: 36upx;
				width: 12upx;
				background-image: linear-gradient(to bottom, #c3defc, #007AFF);
				margin-right: 12upx;
				border-radius: 6upx;
			}
		}
	}
</style>
